<!doctype html>
<html lang="en">

<head>
    <meta charset="utf-8" />
    <link rel="icon" href="./favicon.png" />
    <meta name="viewport" content="width=device-width,initial-scale=1" />
    <meta name="theme-color" content="#000000" />
    <meta name="description" content="WebAR built with MindAR Studio" />
    <link rel="apple-touch-icon" href="./favicon.png" />
    <link rel="manifest" href="./manifest.json" />
    <title>MindAR App</title>
    <script defer="defer" src="./static/js/main.1573730f.js"></script>
    <link href="./static/css/main.43335a5b.css" rel="stylesheet">
</head>

<script>
  // 监听从父窗口 (包装器) 发来的消息
  window.addEventListener('message', function(event) {
    // 安全检查，确保消息来源可信
    // 在实际部署时，您应该将 '*' 替换为您的主应用域名
    // if (event.origin !== 'https://your-app-domain.com') return;

    const { type, payload } = event.data;

    // 如果指令是“切换模型”
    if (type === 'SWITCH_MODEL') {
      console.log('接收到切换指令:', payload.modelName);

      const modelEntity = document.querySelector('[mindar-face-target] > a-entity');
      if (!modelEntity) return;

      const mesh = modelEntity.getObject3D('mesh');
      if (!mesh) return;

      // !! 关键步骤：用接收到的新数据重新创建模型的几何体 !!
      const newGeometry = new THREE.BufferGeometry();
      newGeometry.setAttribute('position', new THREE.Float32BufferAttribute(payload.modelData.positions.flat(), 3));
      newGeometry.setAttribute('uv', new THREE.Float32BufferAttribute(payload.modelData.uvs.flat(), 2));
      newGeometry.setIndex(payload.modelData.faces);
      newGeometry.computeVertexNormals();

      // 遍历并更新网格
      mesh.traverse(function (node) {
        if (node.isMesh) {
          node.geometry.dispose(); // 释放旧的几何体以避免内存泄漏
          node.geometry = newGeometry; // 赋值新的几何体
        }
      });
    }
  });
</script>

<body><noscript>You need to enable JavaScript to run this app.</noscript>
    <div id="root"></div>
</body>

</html>